<template>
	<view>
		<view class="nav-bar">
			<view class="bar-text" @click="goBack">
				<view class="align">

				</view>
				<text>返回</text>
			</view>
		</view>
		<view class="centent-head">
			<view class="title">
				反馈类型
			</view>
			<view class="group">
				<picker class="g-text" mode="selector" :range="feedbackTypes" v-model="selectedTypeIndex"
					@change="onTypeChange">
					<view class="picker">
						<text class="value">{{ feedbackTypes[selectedTypeIndex] }}</text>
					</view>
				</picker>
				<view class="arrow">

				</view>
			</view>
			<view class="title">
				反馈内容
			</view>
			<view class="group">
				<textarea v-model="feedbackContent" :maxlength="500" name=""
					placeholder="对我们网站、商品、服务，你还有什么建议吗？你还希望在商城上买到什么？请告诉我们..."></textarea>
			</view>
			<view class="title">
				联系方式
			</view>
			<view class="group">
				<input v-model="mobile" type="text" placeholder="请输入联系电话,方便我们与您联系">
			</view>
			<view class="btn" @click="submit">
				提交
			</view>
		</view>
	</view>
</template>


<script>
	import api from '../../static/request.js'
	export default {
		data() {
			return {
				feedbackTypes: ['商品相关', '功能异常', '优化建议', '其他'],
				selectedTypeIndex: 0,
				feedbackContent: '',
				mobile: '',
			}
		},
		methods: {
			submit() {
				if (!this.feedbackContent) {
					uni.showToast({
						title: '请填写反馈内容',
						icon: 'none'
					});
					return;
				}
				if (!this.mobile) {
					uni.showToast({
						title: '请输入手机号码',
						icon: 'none'
					});
					return;
				}
				api.post('feedback/submit', {
					content: this.feedbackContent,
					feedType: this.feedbackTypes[this.selectedTypeIndex],
					mobile: this.mobile,
				}).then(res => {
					uni.showToast({
						title: '反馈提交成功',
						icon: 'success'
					});
					this.feedbackContent = '';
					this.mobile = '';
					this.selectedTypeIndex = 0;
					setTimeout(() => {
						uni.switchTab({
							url: '/pages/mine/mine'
						})
					},1000)
				});
			},
			goBack() {
				uni.navigateTo({
					url: '/pages/serveCenter/serveCenter'
				})
			},
			onTypeChange(e) {
				this.selectedTypeIndex = e.detail.value;
			},
			submitFeedback() {
				if (!this.feedbackContent) {
					uni.showToast({
						title: '请填写反馈内容',
						icon: 'none'
					});
					return;
				}
			},
		}
	}
</script>

<style>
	@import url('feedback.css');
</style>